import Vue from 'vue'
import App from './App.vue'
import router from './router'

// 引入全局css样式控制文件
import './assets/css/global.css'

// 引入elementui组件库和注册
import ElementUI from 'element-ui'

// eslint要求import系列代码都放到上边
// 引入、配置axios
import axios from 'axios'

import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

axios.defaults.baseURL = 'http://127.0.0.1:11333/api/private/v1/'
// axios的请求拦截器
axios.interceptors.request.use(
  function(config) {
    // 显示进度条
    NProgress.start()
    // 给axios配置token
    var token = window.sessionStorage.getItem('token')
    if (token !== null) {
      config.headers.Authorization = token
    }
    return config
  },
  function(error) {
    return Promise.reject(error)
  }
)
Vue.prototype.$http = axios

Vue.use(ElementUI)

Vue.config.productionTip = false

new Vue({
  created() {
    // 2. 响应拦截器
    //    因为要操作Vue对象的$message成员，因此拦截器要放到Vue内部
    this.$http.interceptors.response.use(
      response => {
        // 关闭进度条
        NProgress.done()
        // 实现请求完成的后续处理
        // response: 就是axios从服务器端返回的信息，可以参考await修饰的返回结果，是一个对象，有成员config/data/headers/status/statusText

        // 判断请求失败
        // 200:获取、修改、删除 操作结果
        // 201:添加 操作结果
        if (
          response.data.meta.status !== 200 &&
          response.data.meta.status !== 201
        ) {
          return this.$message.error(response.data.meta.msg)
        }

        return response
      },
      function(error) {
        return Promise.reject(error)
      }
    )
  },
  router,
  render: h => h(App)
}).$mount('#app')
